﻿@model List<HQPad.Models.ArmourItem>

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
    string name = (string)ViewBag.CharacterName;
    HQPad.Models.SilhouetteRecord silhouette = (HQPad.Models.SilhouetteRecord)ViewBag.Silhouette;
    HQPad.Models.CharacterHeader header = (HQPad.Models.CharacterHeader)ViewBag.Header;
}

<script src="@Url.Content("~/Scripts/jquery-ui-1.10.3.custom.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.tools.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/waiter.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/character.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/editable.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/armour.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/messagelist.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/global.js")" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $.fn.character({
            raceChangeActionUrl: '@Url.Action("SetRace")',
            classChangeActionUrl: '@Url.Action("SetClass")',
            headerContainerSelector: '.header-container',
            tableChangeCallback: null,
            guildChangeActionUrl: '@Url.Action("SetGuild")',
            guildChangeCallback: null,
            recordContainerSelector: '.record-container',
            addRecordItemUrl: '@Url.Action("AddRecord")',
            addRecordCallback: null,
            headerUrl: '@Url.Action("RefreshHeader")',
            headerRefreshedCallback: function () {
                $('.header-container .tooltipable[title]').tooltip();
            },
            updateNameUrl: '@Url.Action("UpdateName")',
            saveUrl: '@Url.Action("SaveCharacter")',
            silhouetteUrl: '@Url.Action("RefreshSilhouette")',
            silhouetteContainerSelector: '.silhouette-container',
            silhouetteRefreshedCallback: function () {
                // set up generic tooltips.
                $('.tooltipable', '.silhouette-container').tooltip();

                // set up named tooltips.
                setupSilhouette();
            }
        });

        bindModals();

        // set up generic tooltips.
        $('.tooltipable[title]').tooltip();

        setupSilhouette();

        $('.armour-container').armour({
            updateArmourItemUrl: null,
            updateArmourCallback: null,
            removeArmourLinkSelector: '.remove-item',
            removeArmourCallback: function (link) {
                var $parent = $(link.parents('li')[0]);
                $parent.fadeOut(500);
                $parent.remove();
                //                $('.armour-container').armour('refreshArmourList');
                //                $('.armour-container .modal-window').nyroModal({ sizes: { initW: 300, initH: 400} });
                $.fn.character('refreshSilhouette');
            },
            armourListUrl: '@Url.Action("RefreshArmour")',
            armourListContainerSelector: '.armour-container',
            refreshArmourCallback: function () {
                $('.armour-container .modal-window').nyroModal({ sizes: { initW: 300, initH: 400} });

                $('.armour-container .modal-window-custom').nyroModal({
                    sizes: { initW: 300, initH: 400 },
                    callbacks: {
                        afterClose: function (nm) {
                            // ensure that parent page is refreshed.
                            $('.armour-container').armour('refreshArmourList');
                        }
                    }
                });
            },
            equipLinkSelector: '.equip-item',
            equipItemCallback: function () {
                $('.armour-container').armour('refreshArmourList');
                $.fn.character('refreshSilhouette');
            }
        });

        setupMessageList(); // defined in global.
    });

    function bindModals() {
        // set up modal window links.
       // set up modal window links.
        $('.armour-actions .modal-window').nyroModal({
            sizes: { minW: 400, initH: 450, minH: 450, h: 450 },
            callbacks: {
                afterShowCont: modalAfterShowContShort
            }
        });

        $('.armour-container .modal-window').nyroModal({ 
            sizes: { minW: 400, initH: 730, minH: 730, h: 730 },
            callbacks: {
                afterShowCont: modalAfterShowCont
            }
        });

        $('.armour-container .modal-window-custom').nyroModal({
            sizes: { minW: 400, initH: 730, minH: 730, h: 730 },
            callbacks: {
                afterClose: function (nm) {
                    // ensure that parent page is refreshed.
                    $('.armour-container').armour('refreshArmourList');
                    $.fn.character('refreshSilhouette');
                },
                afterShowCont: modalAfterShowCont
            }
        });
    }

    function modalAfterShowCont (nm) {
        $('.nyroModalCont').addClass('custom-modal');
    }

    function modalAfterShowContShort(nm) {
        $('.nyroModalCont').addClass('custom-modal-short');
    }

    function closeModalAndRefresh() {
        $.nmTop().close();

        //$('body').character('refreshHeader');
        $('.armour-container').armour('refreshArmourList');
        $.fn.character('refreshSilhouette');
        $('.tooltipable[title]').tooltip();
    }

    function setupSilhouette() {
        // set up named tooltips.
        $('.named-tooltip', '.silhouette-container').each(function () {
            var tipId = $(this).attr('tip');

            $(this).tooltip({
                tip: '#tooltip-' + tipId,
                position: 'top center',
                offset: [10, 10],
                events: {
                    tooltip: 'mouseleave'
                }
            });
        });
    }

</script>

<h1 class="with-control-box character-name">@Html.Raw(name)</h1>
<div class="message-box"></div>

<section class="full-width header-container">
@Html.Partial("~/Views/Shared/Character/CharacterHeader.cshtml", header)
</section>

@Html.Partial("~/Views/Shared/Character/CharacterTabs.cshtml", header)

<section class="content flush-with-nav flat-top armour-container">
@Html.Partial("~/Views/Shared/Character/CharacterArmours.cshtml", Model)
</section>

<section class="sidebar flush-with-nav">
    <div class="silhouette-container">
        @Html.Partial("~/Views/Shared/Character/CharacterSilhouette.cshtml", silhouette)

    </div>
    <div class="sidebar-container armour-actions sidebar-bottom-margin">
        <h2>Actions</h2>
        <div>
            @Html.ActionLink("Add Armour", "EditArmour", "Character", null, new { @class = "edit-record modal-window button", @target = "_blank" })
        </div>
    </div>
</section>
